<template>
	<view class="history">
		<view class="list" >
			<view class="li" v-for="item in list" :key="item">
				<view class="txt">{{item.question}}</view>
				<view class="time">
					<text>{{format(item.createTime)}}</text>
					<text class="btn" @click="jxdh(item)">继续对话 >></text>
				</view>
			</view>
			<view :style="{height: safeBottom+'px',position:'fixed',left:0,bottom:0,width:'100%',background:'#fff'}"></view>
			<view v-if="pageNo===totalPage" style="text-align: center;font-size: 24rpx;color: #999;margin-top: 20rpx;">没有更多了...</view>
		</view>
		<view class="emptyBox" v-if="list.length===0" @click="goQA">
			<image src="@/static/image/empty.png" class="empty"></image>
			<view class="tips">你还没创建对话，<text>去创建>></text> </view>
		</view>
	</view>
</template>
<script>
	export default
	{
		data()
		{
			return {
				list: [],
				pageNo: 1,
				pageSize: 10,
				totalPage: 0,
				safeBottom: uni.getStorageSync('safeBottom'),
			}
		},
		mounted()
		{
			this.init()
		},
		onReachBottom()
		{
			console.log('已触底');
			if (this.pageNo >= this.totalPage) return false
			this.pageNo += 1
			this.init()
		},
		onPullDownRefresh()
		{
			this.pageNo = 1
			this.list = []
			this.init()
		},
		methods:
		{
			jxdh(row){
				const data = encodeURIComponent(JSON.stringify(row))
				uni.navigateTo({
					url:'/pages/index/index?from=h&data='+data
				})
			},
			goQA()
			{
				if(!uni.getStorageSync('openid')){
					uni.reLaunch({
						url:'/pages/login/index'
					})
					return
				}
				uni.navigateTo(
				{
					url: '/pages/index/index'
				})
			},
			async init()
			{
				uni.showLoading(
				{
					title: '加载中...'
				})
				const res = await this.$post('api/getHistoryQuestions',
				{
					"openid": uni.getStorageSync('openid'),
					"pageNumber": this.pageNo,
					"pageSize": this.pageSize
				},
				{
					"Content-Type": 'application/json'
				})
				uni.hideLoading()
				console.log(res, 'sssssss');
				uni.stopPullDownRefresh()
				if (res.status == 200)
				{
					console.log(res, 'sssssss');
					this.list = this.list.concat(...res.data.records)
					this.totalPage = Math.ceil(res.data.total/this.pageSize)
				}
			},
			format(dat)
			{
				dat = new Date(dat)
				//获取年月日，时间
				var year = dat.getFullYear();
				var mon = (dat.getMonth() + 1) < 10 ? "0" + (dat.getMonth() + 1) : dat.getMonth() + 1;
				var data = dat.getDate() < 10 ? "0" + (dat.getDate()) : dat.getDate();
				var hour = dat.getHours() < 10 ? "0" + (dat.getHours()) : dat.getHours();
				var min = dat.getMinutes() < 10 ? "0" + (dat.getMinutes()) : dat.getMinutes();
				var seon = dat.getSeconds() < 10 ? "0" + (dat.getSeconds()) : dat.getSeconds();
				var newDate = year + "-" + mon + "-" + data + " " + hour + ":" + min + ":" + seon;
				return newDate;
			}
		}
	}
</script>
<style scoped lang="scss">
	.history {
		width: 100vw;
		overflow-y: auto;
		padding-bottom: 200rpx;
		.list {
			width: 100%;
			
			padding: 0 22rpx;
			box-sizing: border-box;

			.li {
				width: 100%;
				padding: 46rpx 0 23rpx 0;
				border-bottom: 1px solid #F3F3F3;

				.txt {
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;
					margin-bottom: 20rpx;
				}

				.time {
					display: flex;
					justify-content: space-between;

					text {
						height: 34rpx;
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #999999;
						line-height: 34rpx;
					}

					.btn {
						color: #2A87FF;
						font-size: 28rpx;
					}
				}
			}
		}
	}

	.emptyBox {
		width: 100vw;
		height: 100vh;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		position: fixed;
		left: 0;
		top: 0;

		.empty {
			width: 166rpx;
			height: 154rpx;
		}

		.tips {
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #666666;
			line-height: 40rpx;
			margin-top: 60rpx;

			text {
				color: #2A87FF;
			}
		}
	}
</style>
